<template>
	<view class="content">
		<jade-checkbox :map="map" v-model="package_ids" :list="list" :title="checkTitle" @change="change" ></jade-checkbox>
		<uni-data-checkbox mode="list" :map="map" multiple v-model="package_ids" :localdata="list" />
	</view>
</template>

<script>
import { gradeClassStudentTree } from '@/api/classCircle.js';

export default {
	data() {
		return {
			map: {
				text: 'className',
				value: 'classId'
			},
			checkTitle: '全选',
			list: [
				
			],
			package_ids: []
		};
	},
	onLoad() {
		if(uni.getStorageSync('selectClassIndex').length){
			this.package_ids=uni.getStorageSync('selectClassIndex')
		}else{
			this.package_ids=[]
		}
		this.gradeClassStudentTree()
	},
	methods: {
		async gradeClassStudentTree(){
			const {data}=await gradeClassStudentTree()
			console.log('返回参数',data)
			if(data.code=='0'){
				data.data.forEach(it=>{
					this.list.push(...it.classTreeList)
				})
			}
		},
		change(e) {
			this.package_ids = e;
			console.log('选中班级', e);
			let selectList = [];
			this.package_ids.forEach(it => {
				this.list.forEach(its => {
					if (it == its.classId) {
						selectList.push(its)
					}
				});
			});
			console.log('选择的班级',selectList)
			uni.setStorageSync('selectClass', selectList);
		}
	}
};
</script>
<style scoped lang="scss">
page {
	background-color: #f1f1f1;
	width: 100%;
	height: 100%;
}
.content {
	display: flex;
	flex-direction: column;
	justify-content: center;
	box-sizing: border-box;

	.title {
		padding: 30rpx 0;
		color: #8f8f94;
	}
	.font-1 {
		font-size: 34rpx;
	}
	.color {
		color: #333333;
	}
}
/deep/.uni-data-checklist .checklist-group .checklist-box {
	background-color: #fff !important;
	margin-bottom: 16rpx !important;
	padding-top: 27rpx !important;
	padding-bottom: 27rpx !important;
	padding-left: 20rpx !important;
}
/deep/.cu-checked-group {
	padding-left: 20rpx !important;
}
/deep/.uni-data-checklist .checklist-group .checklist-box.is--list.is-checked .checkbox__inner {
	border-color: $uni-theme-color;
	background-color: $uni-theme-color;
}
/deep/.uni-data-checklist .checklist-group .checklist-box.is--list.is-checked .checklist-text {
	color: $uni-theme-color;
}
</style>
